<template>
  <div class="form-section">
    <ra-multi-lang
      v-model="formData.translations"
      :languages="languageList"
      :required="false"
      :prop-prefix="'formData'"
      :show-key-input="true"
      :key-value="formData.key"
      :key-prop="'key'"
      @update:keyValue="handleKeyUpdate"
      @getTransData="getTransData"
    />
  </div>
</template>

<script setup>
import { smartTranslate as $t, transPlaceholder as $p } from '@/lang';

// 处理语言键更新
const handleKeyUpdate = (newKey) => {
  props.formData.key = newKey;
};

const props = defineProps({
  formData: {
    type: Object,
    required: true,
  },
  languageList: {
    type: Array,
    default: () => [],
  },
  getTransData: {
    type: Function,
    required: true,
  },
});
</script>

<style lang="scss" scoped></style>
